<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
  <base href="/">
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no, shrink-to-fit=no">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <meta name="apple-mobile-web-app-capable" content="no">
  <meta name="format-detection" content="telephone=no">
  <title>关联已有帐号</title>
  <script src="static/js/cssrem.js"></script>
<link href="static/css/style.css" rel="stylesheet"></head>
<body class="bgwh">
  <div class="content mark-content-top">
    <div class="wrapper">
    <dl class="m20 pl20 pr20">
      <dt class="mt20 pt20 g9 f32 pb20">请填写您要关联的账号信息：</dt>
      <dd class="pt20"><input class="ui-login-input f30" type="tel" placeholder="请输入手机号" name="phone" data-verified="^1[3-9]\d{9}$" data-tips="手机号不能为空！|请输入正确的手机号！"
            maxlength="11"></dd>
      <dd class="pt20"><input class="ui-login-input f30" type="password" placeholder="请输入密码" name="password" maxlength="18" data-verified="^[\d\w]{6,18}$"
            data-tips="密码不能为空！|请输入6-18位由数字或字母组成的密码！"></dd>
      <dd class="m20 p20"></dd>
    </dl>
    <div class="m20 p10"></div>
    <div class="m20 pl10 pr10"><a id="loginBinding" class="ui-login-btn ui-login-btn--primary db f32 js-btn-submit ui-login-btn--disabled" href="javascript:;">将微信关联此账号</a></div>
    </div>
  </div>
  <input class="forward" type="hidden" value="${forward}">
<script src="static/js/layer_mobile/layer.js"></script>
<script type="text/javascript" src="static/js/app.js"></script>
<script src="https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5.min.js"></script>
<script src="https://cdn.bootcss.com/axios/0.16.2/axios.min.js"></script>
<script>
/* document.addEventListener('DOMContentLoaded',function(){
    var loginBinding = document.querySelector('#loginBinding');
    loginBinding.addEventListener('click',function(){
  	  //var parent  = document.querySelector('.ui-login-input')
  	  var inputs = document.querySelectorAll('.ui-login-input')
  	  var phone = inputs[0].value
  	  var password = inputs[1].value
  	  var openid = getCookie("publicOpenid")
  	  var formData = new FormData()
      formData.append('phone',phone)
      formData.append('pwd',md5(password))
      formData.append('openid',openid)
      
      if(!verified(0,inputs)) return false;
        
  	  submit('wap/login/loginBinding',formData)
    })
    
  }); */

function getCookie(cookieName) {
    var strCookie = document.cookie;
    var arrCookie = strCookie.split("; ");
    for(var i = 0; i < arrCookie.length; i++){
        var arr = arrCookie[i].split("=");
        if(cookieName == arr[0]){
            return arr[1];
        }
    }
    return "";
}

/* function verified(index,inputs){
	var tips = '',status = false
	if(index === 0){
		var phoneValue = inputs[0].value.trim()
    	var pwd = inputs[1].value.trim()
    	if(phoneValue==''){
    		tips = '手机号不能为空！'
    	}else if(!/^1[356789]\d{9}$/.test(phoneValue)){
    		tips = '请输入正确的手机号！'
    	}else if(pwd==''){
    		tips = '密码不能为空！'
    	}else if(!/^[\d\w]{6,18}$/.test(pwd)){
    		tips = '请输入6-18位字母数字组合的密码'
    	}else{
    		status = true
    	}
	}
	
	if(!status){
		layer.open({
            content: tips,
            skin: 'msg',
            time: 2
          })
	}
	return status
	
} */
document.addEventListener('DOMContentLoaded', function () {
    var eInputs = document.querySelectorAll('[data-verified]')
    var isSubmitDisabled = false
    for (var i = 0; i < eInputs.length; i++) {
      var element = eInputs[i];
      // 输入验证
      element.addEventListener('input', function () {
        var value = this.value.trim()
        if (this.name === 'phone') {
          this.value = value.replace(/\D+/, '')
        } else {
          this.value = value.match(/[\w\d]+/g)
        }
        submitActive()
      });
      // 离开验证
      element.addEventListener('blur', function () {
        var is = verified(this, {
          regexp: this.dataset.verified,
          tips: this.dataset.tips
        })
      })
    }
    // 点击
    var btnSubmit = document.querySelector('.js-btn-submit')
    var status = true
    btnSubmit.addEventListener('click', function () {
      var isDisabled = this.classList.contains('ui-login-btn--disabled')
      if (!status || isDisabled) return false
      
      var inputs = document.querySelectorAll('.ui-login-input')
  	  var phone = inputs[0].value
  	  var password = inputs[1].value
  	  var openid = getCookie("publicOpenid")
  	  var formData = new FormData()
      formData.append('phone',phone)
      formData.append('pwd',md5(password))
      formData.append('openid',openid)
        
  	  submit('wap/login/loginBinding',formData)
      
    })
  })
function submitActive() {
    var eInputs = document.querySelectorAll('[data-verified]')
    var btnSubmit = document.querySelector('.js-btn-submit')
    for (var i = 0; i < eInputs.length; i++) {
      var element = eInputs[i];
      var value = element.value.trim()
      var regexp = new RegExp(element.dataset.verified, 'g')
      var d = regexp.test(value)
      if (!d) {
        isSubmitDisabled = false
        btnSubmit.classList.add('ui-login-btn--disabled')
        break;
      } else {
        isSubmitDisabled = true
        btnSubmit.classList.remove('ui-login-btn--disabled')
      }
    }
  }
function verified(eInput, obj) {
    var value = eInput.value.trim()
    var regexp = new RegExp(obj.regexp, 'g')
    var d = regexp.test(value)
    var tips = obj.tips.indexOf('|') > -1 ? obj.tips.split('|') : obj.tips
    if (value === '') {
      return layer.open({
        content: tips[0],
        skin: 'msg',
        time: 2
      }), false
    } else if (!d) {
      return layer.open({
        content: tips[1],
        skin: 'msg',
        time: 2
      }), false
    } else {
      return true
    }
  }
  
function submit(url,params){
	
	axios({
        method: 'post',
        url: url,
        data:params,
        headers: { 'X-Requested-With': 'XMLHttpRequest' }
    }).then(function (res) {
    	var state = res.data.result.state
    	var message = res.data.result.message
    	if(state!=1){
    		return layer.open({ content: message,skin:'msg',time: 2 })
    	}
   		var d = document.querySelector(".forward").value.trim()
   		if(d != ''){location.href=d}
    }).catch(function(err){
    	console.log(err)
    	layer.open({ content: '请求失败！',skin:'msg',time: 2 }) 
    })
}
  
</script>
	<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?24fb3d27099c50ae04b59301e492b50c";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>
</body>
</html>
